Skip to content

feat: expose deviceDetails in healthcheck endpoint for responsive capture#2112

Merged
bhokaremoin merged 3 commits intomasterfrom
PPLT-4949-send-build-device-details
Feb 24, 2026
Merged

feat: expose deviceDetails in healthcheck endpoint for responsive capture#2112
bhokaremoin merged 3 commits intomasterfrom
PPLT-4949-send-build-device-details

Conversation

@bhokaremoin
Copy link
Contributor

@bhokaremoin bhokaremoin commented Feb 23, 2026

Jira: https://browserstack.atlassian.net/browse/PPLT-4949

Overview

This PR adds the complete deviceDetails object to the /percy/healthcheck endpoint response and stores it in the SDK's percy object for easy access across all SDKs.

Problem

Currently, the healthcheck endpoint only exposes device widths via widths.mobile, which limits SDKs to accessing partial device information. For responsive capture, we need the complete device details (including height, devicePixelRatio, etc.) to properly resize the browser viewport to match mobile browser dimensions during snapshot capture.

Solution

  • API Changes: Added deviceDetails field to /percy/healthcheck endpoint response containing the complete device configuration array
  • SDK Changes: Store deviceDetails from healthcheck response in the percy object for SDK consumption
  • Previously: Only device widths were accessible via percy.deviceDetails.map(d => d.width)
  • Now: Complete device objects are accessible via percy.deviceDetails

Use Case

This enables responsive capture functionality to:

  1. Access device height information to resize browser viewport vertically
  2. Retrieve devicePixelRatio for accurate rendering
  3. Access any additional device properties needed for mobile browser simulation

Changes

Code

  • packages/core/src/api.js: Export deviceDetails in healthcheck response
  • packages/sdk-utils/src/percy-enabled.js: Store deviceDetails from healthcheck

Tests

  • Updated healthcheck endpoint tests to validate deviceDetails in response
  • Added SDK tests to verify deviceDetails is properly stored after isPercyEnabled()
  • Added tests for both empty and populated deviceDetails scenarios

Testing

  • All existing tests pass
  • New tests cover both empty array and populated deviceDetails scenarios
  • Validated integration between API endpoint and SDK storage

- Export complete deviceDetails object from /percy/healthcheck endpoint
- Store deviceDetails in percy object in sdk-utils for easy access
- Previously only device widths were available, now full device info is accessible
- Add deviceDetails to expected healthcheck response validation
- Test deviceDetails is properly stored in percy object after isPercyEnabled
- Add test cases for both empty and populated deviceDetails scenarios
- Validate deviceDetails integration in /test/api/config test
@bhokaremoin bhokaremoin requested a review from a team as a code owner February 23, 2026 14:40
@bhokaremoin bhokaremoin changed the title Pplt 4949 send build device details feat: expose deviceDetails in healthcheck endpoint for responsive capture Feb 23, 2026
percy.config.snapshot.widths = body.config;
percy.deviceDetails = body.mobile?.map((w) => { return { width: w }; });
// Support setting deviceDetails directly or deriving from mobile widths
percy.deviceDetails = body.deviceDetails || body.mobile?.map((w) => { return { width: w }; });
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Here we will get height also right ? because if mobile devices are enabled then we will capture DOM at device height- like below
[{width: , height:, devicePixelRatio: }]

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

deviceDetails will return [{width: , height:, devicePixelRatio: }] only.

|| body.mobile?.map((w) => { return { width: w }; }); - this is a fallback if deviceDetails for some reason comes as undefined,

It can be removed if required

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yes, that second part can be removed, but its on you whether to keep it or not

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

actually this is /test endpoint it used only in our sdk test so no worries on it.

@bhokaremoin bhokaremoin merged commit 005be06 into master Feb 24, 2026
89 of 92 checks passed
@bhokaremoin bhokaremoin deleted the PPLT-4949-send-build-device-details branch February 24, 2026 12:02
@bhokaremoin bhokaremoin added the ✨ enhancement New feature or request label Feb 24, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

✨ enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants